<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>
        小米商城 - Xiaomi 11 Ultra、Redmi K40 Pro、MIX FOLD，小米电视官方网站
    </title>
    <link rel="stylesheet" href="./css样式表/1.CSS">
    <link rel="stylesheet" href="./css样式表/base.css">
    <link rel="stylesheet" href="./css样式表/index.css">
    <link rel="stylesheet" href="./fontawesome/css/all.css">
    <!-- 设置收藏时的图标 -->
    <link rel="icon" href="./img/favicon.ico">
</head>
<body>
    <!-- 顶部导航条 -->
    <div class="topLeadBox">
        <div class="topLead">
            <ul class="tpLdFunction">
                <li><a href="#">小米商城</a></li>
                <li class="line">|</li>
                <li><a href="#">MIUI</a></li>
                <li class="line">|</li>
                <li><a href="#">loT</a></li>
                <li class="line">|</li>
                <li><a href="#">云服务</a></li>
                <li class="line">|</li>
                <li><a href="#">天星数科</a></li>
                <li class="line">|</li>
                <li><a href="#">有品</a></li>
                <li class="line">|</li>
                <li><a href="#">小爱开放平台</a></li>
                <li class="line">|</li>
                <li><a href="#">企业团购</a></li>
                <li class="line">|</li>
                <li><a href="#">资质证照</a></li>
                <li class="line">|</li>
                <li><a href="#">协议规则</a></li>
                <li class="line">|</li>
                <li class="downloadApp">
                    <a href="#" class="downloadA">下载app</a>
                    <div class="downloadAppCt">
                        <a href="#">
                            <div class="downloadImg"><img src="./img/download.png"></div>
                            <span>小米商城APP</span>
                        </a>
                    </div>
                    <div class="triangle"></div>
                </li>
                <li class="line">|</li>
                <li><a href="#">智能生活</a></li>
                <li class="line">|</li>
                <li><a href="#">Select Location</a></li>
            </ul>
            <div class="shopCar">
                <a href="#"><i class="fa fa-cart-plus">&nbsp;&nbsp;购物车 (0)</i></a>
                <div class="shopCarCt">购物车中还没有商品，赶紧选购吧！</div>
            </div>
            <ul class="tpLdService">
                <li><a href="#">消息通知</a></li>
                <li class="line">|</li>
                <li><a href="#">注册</a></li>
                <li class="line">|</li>
                <li><a href="#">登录</a></li>
            </ul>
        </div>
    </div>


    <!-- 头部导航条 -->
    <head class="w">
        <div class="headLeadBox">
            <div class="headLead">
                <div class="logo">
                    <a href="#" title="小米官网">
                        <img src="./img/logo-mi2.png" class="logoMi">
                    </a>
                </div>
                <div class="hdLdFunction">
                    <ul class="nav">
                        <li class="allGoods">
                            <a href="#">全部商品分类</a>
                            <!-- 设置左侧导航条 -->
                            <div class="leftLeadBox">
                                <ul class="leftLead">
                                    <li>
                                        <a href="#">手机</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">电视</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">笔记本 平板</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">家电</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">出行 穿戴</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">智能 路由器</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">电源 配件</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">健康 儿童</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">耳机 音箱</a>
                                        <i class="fa fa-angle-right"></i>
                                    </li>
                                    <li>
                                        <a href="#">生活 箱包</a>
                                        <i class="fa fa fa-angle-right"></i>
                                    </li>
                                </ul>
                            </div>
                        </li>
                        <div class="showGoods">
                            <li><a href="#">Xiaomi手机</a></li>
                            <li><a href="#">Redmi 红米</a></li>
                            <li><a href="#">电视</a></li>
                            <li><a href="#">笔记本</a></li>
                            <li><a href="#">平板</a></li>
                            <li><a href="#">家电</a></li>
                            <li><a href="#">路由器</a></li>
                        </div>
                        <li><a href="#">服务</a></li>
                        <li><a href="#">社区</a></li>
                        <div class="showGoodsBox"></div>
                    </ul>
                </div>
                <form class="hdLdSearch">
                    <input type="search" value="小米平板5"></input>
                    <button href="#"><i class="fa fa-search"></i></button>
                    <div class="SearchCt">
                        <ul>
                            <li><a href="#"><span>全部商品</span></a></li>
                            <li><a href="#"><span>电视</span></a></li>
                            <li><a href="#"><span>小米手机</span></a></li>
                            <li><a href="#"><span>小米平板5</span></a></li>
                            <li><a href="#"><span>洗衣机</span></a></li>
                            <li><a href="#"><span>显示器</span></a></li>
                            <li><a href="#"><span>耳机</span></a></li>
                            <li><a href="#"><span>空气净化器</span></a></li>
                        </ul>
                    </div>
                </form>
            </div>
        </div>
    </head>

    <!-- banner -->
    <div class="banner-wrapper w">
        <div class="banner">
            <ul class="img-list">
                <li>
                    <a href="#">
                        <img src="./img/banner-img1.jpg">
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="./img/banner-img2.jpg">
                    </a>
                </li>
            </ul>
        </div>
        <div class="point-list">
            <div class="point first-point">
                <a href="#"></a></div>
            <div class="point">
                <a href="#"></a>
            </div>
        </div>
        <div class="arrow-wrapper">
            <div class="left-arrrow">
                <a href="#"></a>
            </div>
            <div class="right-arrrow">
                <a href="#"></a>
            </div>
        </div>
    </div>

    <!-- 设置右侧固定工具条 -->
    <div class="right-lead-wrapper">
        <ul>
            <li class="mobile">
                <a href="#"><i class="fa fa-mobile"></i></a>
                <div class="qr-code">
                    <img src="./img/qr-code-img.png" alt="">
                    <span class="first-sentence">扫码领取新</span>
                    <span>人百元礼品</span>
                </div>
                <i class="fa fa-caret-right"></i>
            </li>
            <li class="personal">
                <a href="#"><i class="fa fa-user"></i></a>
                <div class="personal-content">
                    <span>个人中心</span>
                </div>
                <i class="fa fa-caret-right"></i>
            </li>
            <li class="sell-service">
                <a href="#"><i class="fa fa-wrench"></i></a>
                <i class="fa fa-caret-right"></i>
                <div class="sell-service-content">
                    <span>售后服务</span>
                </div>

            </li>
            <li class="manuals-service">
                <a href="#"><i class="fa fa-headphones"></i></a>
                <i class="fa fa-caret-right"></i>
                <div class="manuals-service-content">
                    <span>人工客服</span>
                </div>
            </li>
            <li class="shop-car">
                <a href="#"><i class="fa fa-shopping-cart"></i></a>
                <i class="fa fa-caret-right"></i>
                <div class="shop-car-content">
                    <span>购物车（0）</span>
                </div>
            </li>
        </ul>
    </div>

    <!-- 设置广告一栏 -->
    <div class="ad-wrapper w">
        <div class="ad-service-wrapper">
            <ul class="ad-service">
                <li>
                    <i class="fa fa-clock"></i>
                    <a href="#">保障服务</a>
                </li>
                <li>
                    <i class="fa fa-building"></i>
                    <a href="#">企业采购</a>
                </li>
                <li>
                    <i class="fa fa-taxi"></i>
                    <a href="#">F码通道</a>
                </li>
                <li>
                    <i class="fa fa-credit-card"></i>
                    <a href="#">米粉卡</a>
                </li>
                <li>
                    <i class="fa fa-check-square"></i>
                    <a href="#">以旧换新</a>
                </li>
                <li>
                    <i class="fa fa-phone-square"></i>
                    <a href="#">话费充值</a>
                </li>
            </ul>
        </div>
        <ul class="ad-imgs">
            <li>
                <a href="#">
                    <img src="./img/ad-img1.jpg" alt="">
                </a>
           </li>
            <li>
                <a href="#">
                    <img src="./img/ad-img2.png" alt="">
                </a>
           </li>
            <li>
                <a href="#">
                    <img src="./img/ad-img3.jpeg" alt="">
                </a>
           </li>
        </ul>
    </div>

    <!-- 设置底部广告 -->
    <div class="bottom-ad-wrappr">
        <div class="bottom-ad">
            <a href="#">
                <img src="./img/bottom-img.webp" alt="">
            </a>
        </div>
    </div>
</body>
</html>